* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0;
  outline: 0;
  border: 0;
  vertical-align: baseline;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  zoom: 1
}

a {
  color: #369;
  text-decoration: none;
  white-space: normal;
  word-break: break-all;
  cursor: pointer;
  font-size: 12px;
  font-weight: normal;
}

body {
  background-color: #f6f6f6;
  position: static;
  font-size: 12px;
  font-family: "Helvetica Neue", Helvetica, Arial, STHeiti, "Microsoft Yahei", sans-serif;
  line-height: 16px;
  -webkit-font-smoothing: antialiased
}

.clear {
  clear: both;
}

.floatleft {
  position: relative;
  float: left;
}

.floatright {
  position: relative;
  float: right;
}

#main-container {
  width: 100%;
  margin: 40px 0 0 0;
  padding: 0;
}

#main-container > #index-head-area {
  padding-top: 26px;
}

.area {
  position: relative;
}

.area-inner {
  width: 980px;
  margin: 0 auto;
}

.area-banner {
  position: relative;
  width: auto;
  height: 36px;
  color: #666;
  text-align: left;
  font-size: 14px;
  line-height: 34px;
  zoom: 1;
  margin: 0;
  padding: 0;
}

.area-banner-ch {
  position: relative;
  margin-right: 10px;
  display: inline-block;
}

.area-banner-ch > h3 {
  display: block;
  font-size: 16px;
  letter-spacing: .06em;
  font-weight: normal;
  color: #fff;
  background-color: #00a1d6;
  padding: 0 24px;
  height: 26px;
  line-height: 26px;
  border-radius: 6px
}

.area-banner-line-left {
  position: absolute;
  width: 50%;
  height: 7px;
  bottom: -7px;
  background-color: #f6f6f6;
  z-index: 2;
  left: 0;
  border-right: 1px solid #00a1d6;
}

.area-banner-line-right {
  display: block;
  position: absolute;
  width: 100%;
  border-top: 1px solid #00a1d6;
  font-size: 14px;
}

.area-banner-line-circle {
  position: absolute;
  width: 6px;
  height: 6px;
  background-color: #ffa5c7;
  right: 0;
  bottom: -1px;
}

.list-video-block {
  margin: 20px auto;
}

.list-video-block > .video-block {
  margin: 10px 18px;
}

.video-block {
  width: 160px;
  height: 145px;
  overflow: hidden;
}

.video-block-main {
  display: block;
  width: 160px;
  height: 90px;
  overflow: hidden;
}

.video-block-main > img {
  width: 160px;
  height: 100%;
  border-radius: 16px 12px 12px 12px;
}

.video-block-info {
  -webkit-transition: color .2s ease, height .2s ease;
  -moz-transition: color .2s ease, height .2s ease;
  -ms-transition: color .2s ease, height .2s ease;
  -o-transition: color .2s ease, height .2s ease;
  transition: color .2s ease, height .2s ease;
  display: block;
  width: 100%;
  margin: 8px 0;
  font-size: 12px;
  color: #000;
  line-height: 16px;
  height: 18px;
  overflow: hidden;
}

.video-block-time {
  -webkit-transition: opacity .2s ease;
  -moz-transition: opacity .2s ease;
  -ms-transition: opacity .2s ease;
  -o-transition: opacity .2s ease;
  transition: opacity .2s ease;
  position: absolute;
  color: #fff;
  background-color: rgba(0, 0, 0, .7);
  padding: 0 5px;
  top: 72px;
  right: 0;
  height: 18px;
  overflow: hidden;
  opacity: 0;
  border-radius: 0 0 12px 0;
}

.video-block:hover .video-block-time {
  opacity: 1;
}

.video-block-info-hidden {
  color: #999;
  height: 24px;
  line-height: 24px;
  overflow: hidden;
  font-size: 11px;
  top: 114px;
  left: 0;
}

.video-block:hover .video-block-info {
  height: 32px;
}

.video-block-info-hidden > .left {
  margin-left: 2px;
}

.video-block-info-hidden > .right {
  margin-right: 2px;
}

.video-block-info:hover {
  color: #ffa5c7;
}

.video-block-info:visited {
  color: #888;
}

/*遮罩block*/
.video-block-mask {
  width: 160px;
  height: 100px;
  overflow: hidden;
}

.video-block-mask-preview {
  height: 100px;
  background: 0;
  overflow: hidden;
  border-radius: 4px;
}

.video-block-mask-preview > img {
  height: 100%;
  margin: 0 auto;
  display: block;
}

.video-block-mask-mask {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  top: 0;
  left: 0;
  background: #000;
  background: rgba(0, 0, 0, 0.7);
  filter: alpha(opacity=70);
  z-index: 1;
  transition: .3s all linear;
  border-radius: 4px;
}

.video-block-mask:hover .video-block-mask-mask {
  visibility: visible;
  opacity: 1;
}

.video-block-mask-info {
  height: 30px;
  padding: 0;
  overflow: hidden;
  position: absolute;
  top: 70px;
  width: 100%;
  bottom: 0;
  left: 0;
  z-index: 1;
  background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.2) 35%, rgba(0, 0, 0, 0.6) 65%, rgba(0, 0, 0, 0.9));
  background: -o-linear-gradient(transparent, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.2) 35%, rgba(0, 0, 0, 0.6) 65%, rgba(0, 0, 0, 0.9));
  background: -moz-linear-gradient(transparent, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.2) 35%, rgba(0, 0, 0, 0.6) 65%, rgba(0, 0, 0, 0.9));
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.2) 35%, rgba(0, 0, 0, 0.6) 65%, rgba(0, 0, 0, 0.9));
  border-radius: 0 0 4px 4px;
}

.video-block-mask:hover .video-block-mask-info {
  top: 0;
  height: 70px;
  background: none;
}

.video-block-mask:hover .up, .video-block-mask:hover .play {
  opacity: 1;
}

.video-block-mask-info > .title {
  height: 36px;
  margin: 10px 5px 0 5px;
  line-height: 18px;
  overflow: hidden;
  color: #fff;
  font-size: 12px;
  word-break: break-all;
  word-wrap: break-word;
}

.video-block-mask-info > .up {
  margin: 10px 0 5px 5px;
}

.video-block-mask-info > .play {
  margin: 5px 5px 0;
}

.video-block-mask-info > .play, .video-block-mask-info > .up {
  color: #99a2aa;
  transition: .4s all linear;
  opacity: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

#main-header {
  z-index: 2;
  width: 100%;
}

#main-header.hidden-background .main-header-image {
  display: none;
}

.main-header-nav {
  background-color: #fff;
  border-bottom: 1px solid #ffa5c7;
}

.main-header-nav-body {
  height: 50px;
  width: 980px;
  margin: 0 auto;
}

.main-header-nav-body > .nav-li {
  position: relative;
  font-size: 14px;
  display: block;
  height: 50px;
}

.nav-li > a {
  color: #222;
  display: block;
  font-size: 14px;
  margin: 15px 20px auto 20px;
}

.nav-li > a:hover {
  color: #00a1d6;
}

.nav-li .nav-li-list {
  z-index: 10;
  background-color: #fff;
  display: none;
  width: 128px;
  position: absolute;
  top: 50px;
  box-shadow: 0 2px 3px #ccc;
  overflow: hidden;
}

.nav-li:hover .nav-li-list, .nav-li > a:hover .nav-li-list, .nav-li-list:hover {
  display: block;
}

.nav-li-list > a {
  display: block;
  color: #000;
  width: 118px;
  height: 34px;
  margin: 10px auto 0 10px;
  padding-top: 5px;
  font-size: 14px;
  transition: .3s;
}

.nav-li-list > a:hover {
  color: #ffa5c7;
  border-right: 2px solid #00a1d6;
}

.nav-li.now {
  border-bottom: 2px solid #00a1d6;
}

/*首页壁纸*/
.main-header-image {
  width: 100%;
  height: 175px;
  background: transparent no-repeat center;
  position: relative;
}

.header-search {
  width: 271px;
  height: 32px;
  background-color: #e5e9ef;
  background-color: rgba(0, 0, 0, 0.12);
  border-radius: 6px;
  margin: 8px 20px auto 20px;
}

.header-container {
  width: 100%;
  background-color: #fff;
  z-index: 3;
}

.header-container.isStuck {
}

.header-search input {
  float: left;
  width: 190px;
  height: 35px;
  line-height: 35px;
  border: 1px solid #00a1d6;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.05) inset;
  border-right: 0;
  margin: 0;
  padding: 0 10px 0 30px;
  border-radius: 8px 0 0 8px;
  box-sizing: border-box;
  color: #999;
  font-size: 12px
}

.btn:hover {
  background-color: #bbb;
}

.btn {
  height: 28px;
  line-height: 28px;
  padding: 0 12px;
  border-radius: 1px 0 0 1px;
  color: #333;
  border-color: #bbb;
}

.btn.active {
  border: 0;
  background-color: #288ecf;
  color: #fff
}

/*搜索框*/
.header-search .btn-search {
  border-radius: 0 8px 8px 0;
  width: 80px;
  height: 35px;
  margin: 0;
  padding-left: 10px;
  border: 1px solid #00a1d6;
  background-color: #00a1d6;
  color: #fff;
  font-size: 16px;
  cursor: pointer;
  overflow: hidden;
}

.btn-search:hover {
  background-color: #76c4d2;
  border-color: #76c4d2;
}

/*首页banner*/
.unslider-banner {
  width: 450px;
  overflow: hidden;
}

.block-banner {
  margin-top: 20px;
  width: 430px;
  height: 215px;
  float: left;
  overflow: hidden;
  border-radius: 12px;
}

.block-banner img {
  height: 100%;
}

.block-banner > ul {
  height: 100%;
  width: 500%;
  position: absolute;
  left: 0;
}

.block-banner > .info-bottom {
  height: 34px;
  line-height: 40px;
  padding: 0 80px 0 11px;
  cursor: auto;
  position: absolute;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.45);
  background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
  background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
  background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
  background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000, endColorstr=#66000000);
  width: 100%;
  color: #fff;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
}

.unslider .unslider-nav {
  display: block;
  position: absolute;
  right: 18px;
  bottom: 6px;
  height: 14px;
}

.unslider .unslider-nav li {
  display: block;
  cursor: pointer;
  margin: 0 4px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #00a1d6;
  float: left;
  line-height: 0;
  font-size: 0;
}

#index-head-area .left-block {
  width: 450px;
  margin: 0 auto;
  height: 300px;
}

#index-head-area .right-block {
  width: 530px;
}

.right-block > .video-block-mask {
  margin: 14px 8px;
}

/*分类页面*/
.sort-left > .banner {
  height: 28px;
  line-height: 28px;
  border-bottom: 1px solid #ddd;
}

.banner > p {
  font-size: 20px;
  color: #333;
  height: 25px;
  width: auto;
  line-height: 20px;
  padding: 0;
  overflow: hidden;
}

.area-inner > .sort-left {
  width: 700px;
}

.area-inner > .sort-right {
  margin-left: 30px;
  width: 250px;
}

.area-inner > .sort-right > .banner {
  border-bottom: 1px solid #e84c3d;
}

.sort-tool-box {
  width: 260px;
  margin: 12px 0 0 0;
}

.sort-tool-box > .btn {
  margin: 5px 15px 5px 0;
  cursor: pointer;
}

.list-sort-block {
  margin-top: 10px;
  border-top: 1px solid #e5e9ef;
}

.video-item {
  border-right: 1px solid #e5e9ef;
  border-bottom: 1px solid #e5e9ef;
}

.video-block-small {
  width: 330px;
  height: 94px;
  margin: 10px 9px 40px 9px;
  overflow: hidden;
}

.video-block-small > .left {
  width: 150px;
}

.video-block-small > .right {
  width: 180px;
  padding-left: 10px;
}

.video-block-small .thumb {
  width: 150px;
  height: 94px;
  overflow: hidden;
}

.video-block-small .thumb > img {
  margin: 0 12px 0 0;
  height: 100%;
}

.video-block-small .info {
  position: absolute;
  height: 22px;
  line-height: 26px;
  padding: 0 3px;
  color: #ccc;
  bottom: 0;
  left: 0;
  width: 150px;
  top: auto;
  background-color: transparent;
  background-color: rgba(0, 0, 0, 0.45);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000, endColorstr=#66000000);
}

.info > .info-text {
  color: #ccc;
  font-size: 11px;
}

.video-block-small .title {
  font-size: 14px;
  line-height: 16px;
  height: 32px;
  width: 170px;
  margin: 0;
  color: #333;
  overflow: hidden;
  word-break: break-all;
  -webkit-transition: color .2s ease;
  -moz-transition: color .2s ease;
  -ms-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
}

.video-block-small .title:hover {
  color: #e04270;
}

.up {
  display: block;
  height: 16px;
  overflow: hidden;
  margin: 8px 0;
  color: #ff9101;
}

.up:hover {
  color: #e84c3d;
}

.video-block-small .desc {
  color: #999;
  display: inline-block;
  overflow: hidden;
  line-height: 16px;
  height: 16px;
}

.side-video-list {
  width: 100%;
  margin-top: 20px;
}

.side-video-item {
  height: 65px;
  margin: 0 0 12px;
  border-bottom: 1px solid #eee;
  padding: 0 4px;
  position: relative;
}

.side-video-item > .left {
  display: block;
  width: 74px;
}

.side-video-item > .left > img {
  width: 74px;
  height: 41px;
}

.side-video-item > .right {
  width: 150px;
  margin: 0 auto 0 10px;
}

.side-video-item .title {
  display: block;
  width: 150px;
  font-size: 12px;
  height: 16px;
  line-height: 16px;
  overflow: hidden;
  -webkit-transition: color .2s ease;
  -moz-transition: color .2s ease;
  -ms-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
  color: #888;
}

.side-video-item .title:hover {
  color: #e04270;
}

/*页脚*/
#footer {
  margin-top: 50px;
  width: 100%;
  height: 230px;
  background-color: #eee;
}

.about-block {
  margin-top: 40px;
  overflow: hidden;
}

.about-item {
  width: 320px;
  height: 150px;
  padding-left: 20px;
}

.about-item.left {
  border-right: 1px solid #cfd3d8;
}

.about-item.right {
  border-left: 1px solid #cfd3d8;
}

.about-title {
  text-align: left;
  list-style: none;
  line-height: 22px;
  font-size: 14px;
  color: #7e858c;
}

.about-links > a {
  margin: 3px 0;
  display: block;
  color: #222;
  line-height: 22px;
  font-size: 13px;
}

.about-links > a:hover {
  color: #00a1d6;
}

.about-links {
  margin-top: 20px;
}

/*播放页面*/

#main-container.concat {
  margin-top: 0;
}

.area-player {
  margin-top: 30px;
  margin-bottom: 30px;
}

.video-info {
  width: 100%;
  padding: 0 0 10px 0;
  background-color: #FFF;
  border-bottom: 1px solid #dadde3;
}

.video-info .left {
  padding: 5px 0 8px 0;
  width: 640px;
  overflow: hidden;
}

.video-info .right {
  width: 240px;
  overflow: hidden;
}

.video-info .title > h1 {
  display: block;
  color: #525659;
  overflow: hidden;
  line-height: 24px;
  width: 100%;
  text-overflow: ellipsis;
  font-weight: normal;
  white-space: nowrap;
  padding: 8px 0;
  font-size: 20px;
}

.video-info .info {
  width: 400px;
  margin: 10px auto;
}

.video-info .play-info > .info-text {
  color: #99a2aa;
  font-size: 11px;
  margin-right: 20px;
}

.video-info .info > .info-text {
  color: #99a2aa;
  font-size: 13px;
}

.video-info .up-face {
  margin: 15px 15px 0 0;
}

.video-info .up-face > a > img {
  display: block;
  height: 64px;
  width: 64px;
  border-radius: 64px;
  margin: 0 auto;
  border: 2px solid transparent;
  position: relative;
  z-index: 10
}

.video-info .up-info {
  margin: 15px auto 10px 20px;
}

.up-info > .title {
  max-width: 120px;
  font-size: 14px;
  word-wrap: break-word;
  overflow: hidden;
  word-break: break-all;
  text-overflow: ellipsis;
  height: 20px;
  white-space: nowrap
}

.up-info > .brief {
  width: 140px;
  color: #333;
  line-height: 20px;
  min-height: 11px;
  overflow: hidden;
  word-wrap: break-word;
}

.video-brief {
  padding: 30px 0;
  border-top: 1px solid #dadde3;
  border-bottom: 1px solid #dadde3;
}

.video-brief .desc {
  max-height: 120px;
  overflow: hidden;
  white-space: pre-wrap
}

.video-brief .tags {
  width: 100%;
  margin: 20px 0 30px 0;
  border-bottom: 1px solid #dadde3;
}

.video-brief .tags > li {
  list-style-type: none;
  margin: 0 10px 8px 0;
  border: 1px solid #00a1d6;
  border-radius: 20px;
  padding: 0 10px;
  position: relative;
  height: 22px
}

.label {
  display: inline-block;
  font-size: 18px;
  line-height: 24px;
}

.comments {
  margin-top: 30px;
}

.video-part-select {
  margin-bottom: 8px;
  overflow: hidden;
}

.video-part-select > span.active {
  color: #fff;
  background-color: #00a1d6;
  border-color: #00a1d6;
  cursor: not-allowed;
}

.video-part-select > span {
  display: block;
  color: #222;
  border-radius: 4px;
  border: 1px solid #ccd0d7;
  overflow: hidden;
  padding: 3px 7px 3px 7px;
  margin: 0 20px 12px 0;
  background: #fff;
  height: 23px;
  line-height: 17px;
  min-width: 117px;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: .15s;
  transition-property: background-color, border-color, color;
  cursor: pointer;
}

.video-part-select > span:hover {
  color: #fff;
  background-color: #00a1d6;
}

/*搜索部分*/
.search-info {
  padding-top: 30px;
  padding-bottom: 30px;
  background-color: #fff;
  border-bottom: 1px solid #dadde3;
}

.search-block {
  height: 42px;
  width: 430px;
}

.search-block > .input-wrap {
  height: 100%;
  position: relative;
  width: 330px;
  border-radius: 4px;
  margin-right: 10px;
}

.input-wrap > input {
  width: 300px;
  height: 100%;
  box-shadow: none;
  margin-left: 20px;
  padding: 10px 15px;
  background: transparent;
  border: 2px solid #ccd0d7;
  border-radius: 4px;
}

.search-block > .search-btn {
  cursor: pointer;
  float: left;
  width: 90px;
  color: #fff;
  background: #00a1d6;
  border-radius: 4px;
  font-size: 16px;
  letter-spacing: 2px;
  line-height: 42px;
  text-align: center;
}

.search-select-block {
  margin: 20px auto;
  width: 316px;
  height: 100%;
  border-bottom: 1px solid #ccd0d7;
}

.search-select-block > .wrap {
  display: block;
}

.search-select-block > .wrap > .sub {
  list-style-type: none;
  width: 39px;
  height: 100%;
  line-height: 54px;
  font-size: 16px;
  color: #222;
  margin: 0 20px;
  text-align: center;
  cursor: pointer;
}

.search-select-block > .wrap > .sub.active {
  border-bottom: 2px solid #00a1d6;
}

.search-select-block > .wrap > .sub:hover {
  color: #00a1d6;
}

.search-fliter-block {
  margin: 20px auto;
  width: 980px;
  border-bottom: 1px solid #ccd0d7;
}

.search-fliter-block > .wrap {
  display: block;
  margin: 20px auto;
}

.search-fliter-block > .wrap .sub {
  list-style-type: none;
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 4px;
  margin-right: 16px;
  font-size: 14px;
  color: #222;
  text-decoration: none;
  cursor: pointer;
  line-height: 24px;
}

.search-fliter-block > .wrap > .sub:hover {
  color: #00a1d6;
}

.search-fliter-block > .wrap > .sub.active {
  color: #fff;
  background-color: #00a1d6;
}

.search-result-content {
  margin: 20px auto;
  width: 980px;
}

.special-li {
  width: 100%;
  height: 110px;
  padding: 20px 0;
  position: relative;
  border-bottom: 1px solid #e5e9ef;
}

.special-li > .img {
  height: 70px;
  width: 70px;
  border-radius: 4px;
  overflow: hidden;
}

.special-li img {
  width: 100%;
  min-height: 100%;
}

.special-li > .info {
  padding-left: 20px;
  width: 800px;
  height: 70px;
}

.special-li > .info > .title {
  font-size: 16px;
  line-height: 16px;
  color: #222;
}

.special-li > .info > .desc {
  margin-top: 12px;
  color: #99a2aa;
  font-size: 12px;
  line-height: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.special-li > .info > .info {
  margin-top: 5px;
}

.special-li > .info .info-text {
  color: #879098;
  font-size: 12px;
  margin-right: 20px;
}

.search-video-block {
  height: 208px;
  width: 168px;
  border: 1px solid #e5e9ef;
  border-radius: 4px;
  float: left;
  margin: 20px 13px 0 13px;
}

.search-video-block .img {
  height: 100px;
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}

.search-video-block .img > img {
  width: 100%;
  min-height: 100%;
}

.search-video-block .img > .time {
  position: absolute;
  right: 0;
  bottom: 0;
  line-height: 18px;
  padding: 0 5px;
  color: #fff;
  background-color: #333;
  background-color: rgba(0, 0, 0, 0.5);
  border-top-left-radius: 4px;
}

.search-video-block .other-info {
  width: 166px;
  text-align: center;
  margin: 10px auto;
  overflow: hidden;
}

.search-video-block .other-info > .title {
  display: block;
  font-size: 13px;
  line-height: 20px;
  height: 35px;
  overflow: hidden;
  color: #222;
}

.search-video-block .other-info > .title:hover {
  color: #00a1d6;
}

.search-video-block .other-info .info {
  margin: 10px 5px;
}

.search-video-block .other-info .info-text {
  color: #879098;
  font-size: 12px;
  margin-right: 20px;
}

.area-pager {
  overflow: hidden;
  margin: 4px auto;
  padding: 4px 0;
  width: 100%;
  height: auto;
}

.area-pager > span {
  display: block;
  margin: 0 4px 0 0;
  padding: 0 4px;
  min-width: 32px;
  width: auto;
  height: 32px;
  border: none;
  border-radius: 1px;
  background-color: #3a9bd9;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  font-weight: bold;
  font-size: 12px;
  line-height: 32px;
  cursor: pointer;
}

.area-pager > span:hover {
  background-color: #eee;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  color: #333;
}

.area-pager > span.active {
  background-color: #eee;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  color: #333;
}

.area-pager > span.active:hover {
  cursor: not-allowed;
}

.search-pager {
  margin: 30px auto 20px 20px;
}
